<!DOCTYPE html >
<html xmlns:th="http://www.thymeleaf.org">
	<title>爱读书</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="renderer" content="webkit">
	<script lang="javascript" type="text/javascript" th:src="@{https://libs.baidu.com/jquery/1.11.3/jquery.min.js}"></script>
	<link rel="stylesheet" th:href="@{../../static/css/core.min-20160809.css}">
	<link rel="stylesheet" th:href="@{../../static/css/dushu.min-20160802.css}">
	<link rel="stylesheet" th:href="@{../../static/css/font_1468833227_139596.css}">
	<meta name="description" content="爱读书每日一读：">
    <script>
        /*判断是否要显示登陆注册*/
        $(function () {
            if ($('.float-right').find("a:eq(0)").text() == '欢迎回来') {
                $(".float-right").find("a:eq(0)").attr("href", "javascript:;");
                $(".float-right").find("a:eq(1)").attr("href", "javascript:;");
            }
        })
    </script>
    <!--处理是否要显示已点赞-->
    <script>
        $(function () {
            let userId = $(".show-session").find("span:eq(0)").text();
            let bookId = $(".show-session").find("span:eq(1)").text();
            /*判断用户是否点赞*/
            $.post(
                "/like/show",
                {'userId':userId,'bookId':bookId},
                function (data) {
                    if (data == true){
                        $(".thumbs-span").empty();
                        $(".thumbs-span").append("<img src=\"/static/picture/thumbs-up.png\" style=\"width: 30px; height: 30px;\"> <p style=\"display: inline-block;color: #61ABAA;\">已点赞</p>");
                    }else {
                        $(".thumbs-span").empty();
                        $(".thumbs-span").append("<img src=\"/static/picture/thumbs-down.png\" style=\"width: 30px; height: 30px;\">");
                    }
                });
        });
        $(function () {
            let userId = $(".show-session").find("span:eq(0)").text();
            let bookId = $(".show-session").find("span:eq(1)").text();
            /*判断用户是否订阅这本书*/
            $.post(
                "/like/see",
                {'userId':userId,'bookId':bookId},
                function (data) {
                    if (data == true){
                        $(".order-span").empty();
                        $(".order-span").append("<img src=\"/static/picture/order3.png\" alt=\"已订阅\"  title=\"已订阅\" style=\"width: 30px;height: 30px; margin-top: 1px;\"><p style=\"display: inline-block;color: #61ABAA;padding-left: 5px;\">已订阅</p>");
                    }else {
                        $(".order-span").empty();
                        $(".order-span").append("<img src=\"/static/picture/order4.png\" alt=\"未订阅\"  title=\"未订阅\" style=\"width: 30px;height: 30px; margin-top: 1px;\">");
                    }
                })
        })
    </script>
    <!--获取当前图书的第一个章节-->
    <script th:inline="javascript">
        let chapters =[[${chapterBooks.chapters}]][0]
    </script>
    <script>
        console.log(chapters);
    </script>
</head>
<body>

<!--获取session的值并隐藏在页面中-->
<div class="show-session" style="display: none">
    <span th:text="${session.user}==null?'无':${session.user.id}"></span>
    <span th:text="${chapterBooks.id}"></span>
</div>
<!--实现登录注册-->
<div class="layout bg border-bottom">
	<div class="container height-big text-gray">
        <span class="float-right">
            <a th:href="@{/index/toLogin}" th:text="${session.user}==null?'注册':'欢迎回来'" class="text-gray"></a>
            <span class="text-little">|</span>
            <a th:href="@{/index/toLogin}" class="text-gray" th:text="${session.user}==null?'登陆':${session.user.phone}"></a>
        </span>读书好，好读书，读好书！
	</div>
</div>
<!--可下拉式导航栏-->
<div class="layout bg border-bottom fixed-top hidden" style="z-index: 99;" id="fixednav">
	<div class="container"><div class="row">
		<div class="span4">
			<a href="javascript:;" title="读书网">
				<img th:src="@{/static/picture/login1.png}" alt="爱读书"></a></div>
		<div class="span13">
            <ul class="nav nav-inline nav-menu padding-top">
                <li><a href="/index/toRead" >每日一读</a></li>
                <li><a th:href="@{/index/toNovel/1}" >小说作品</a></li>
                <li><a th:href="@{/index/toNovel/2}" >经济管理</a></li>
                <li><a th:href="@{/index/toNovel/3}">历史传记</a></li>
                <li><a th:href="@{/index/toNovel/4}">生活艺术</a></li>
                <li><a th:href="@{/index/toNovel/5}" >文学艺术</a></li>
                <li><a th:href="@{/index/toNovel/6}" >社会科学</a></li>
                <li><a th:href="@{/index/toNovel/7}" >成功励志</a></li>
            </ul>
		</div>

		<!--轮播图的搜索框-->
		<div class="span7 text-right">
			<form name="searchform" th:action="@{/index/toSearch}">
				<div class="input-group padding-small-top">
					<input required="required" type="text" class="wd input border-main" name="name" value="" autocomplete="off" size="30" placeholder="搜索海量图书/电子书/网络小说">
					<span class="addbtn"><button class="button bg-main"><span class="icon-search"></span></button></span>
				</div>
			</form>
		</div>
	</div>
	</div>
</div>

<!--首页  top-->
<div class="container">
	<div class="row">
		<div class="span8"><a href="javascript:;"  title="爱读书"><img th:src="@{/static/picture/login2.png}" alt="爱读书"></a></div>
		<!--搜索框，通过form表单实现 -->
		<div class="span10 padding-big-top">
			<form name="searchform" th:action="@{/index/toSearch}">
				<div class="input-group padding-little-top margin-big-right">
					<input type="text" required="required" name="name" class="wd input input-big border-main" value="" size="30"
						   placeholder="搜索海量图书">
					<span class="addbtn"><button class="button button-big bg-main" id="search_button"><span
							class="icon-search text-large"></span></button></span>
				</div>
			</form>
		</div>

        <!--实现我的账户和书架-->
        <div class="span6 padding-large-top text-right">
            <div class="button-group" th:if="${session.user} !=null">
                <button type="button" class="button text-main"><span class="icon-user"></span> <a th:href="@{/index/toAccount/}+${session.user.phone}">我的账户</a></button>
                <button type="button" class="button text-main"><span class="icon-shujia"></span><a th:href="@{/index/toBookshelf/}+${session.user.id}">我的书架</a> </button>
            </div>
            <div class="button-group" th:if="${session.user} ==null">
                <button type="button" class="button text-main"><span class="icon-user"></span> <a href="javascript:;">我的账户</a></button>
                <button type="button" class="button text-main"><span class="icon-shujia"></span><a href="javascript:;">我的书架</a> </button>
            </div>
        </div>

	</div>
</div>

<!--图书分类导航-->
<div class="container">
	<div class="row margin-top">
		<div class="span24">
			<ul class="nav nav-menu nav-inline nav-sub nav-big nav-navicon nav-justified border-dot">
				<li id="ctl00_c1_nav_meiwen"><a  th:href="@{/index/toRead}">每日一读</a></li>
				<li id="ctl00_c1_nav_lianzai" class="active"><a  href="javascript:;" >在线读书</a></li>
				<li id="ctl00_c1_nav_daohang"><a href="#">读书导航</a></li>
			</ul>

            <ul class="nav nav-inline nav-menu margin-top nav-justified subnav">
                <li><a th:href="@{/index/toNovel/1}" >小说作品</a></li>
                <li><span class="sep">|</span></li>
                <li><a th:href="@{/index/toNovel/2}">经济管理</a></li>
                <li><span class="sep">|</span></li>
                <li><a th:href="@{/index/toNovel/5}">文学艺术</a></li>
                <li><span class="sep">|</span></li>
                <li><a th:href="@{/index/toNovel/3}">历史传记</a></li>
                <li><span class="sep">|</span></li>
                <li><a th:href="@{/index/toNovel/4}">生活时尚</a></li>
                <li><span class="sep">|</span></li>
                <li><a th:href="@{/index/toNovel/7}">成功励志</a></li>
                <li><span class="sep">|</span></li>
                <li><a th:href="@{/index/toNovel/6}">社会科学</a></li>
            </ul>
        </div>
    </div>
</div>

<!--显示图书信息-->
<div class="container margin-top">
	<div class="crumbs">
		当前位置： <a th:href="@{/}">首页</a>
        <span class="icon-crumb"></span>
        <a th:href="@{/}">在线阅读</a>
        <span class="icon-crumb"></span>
        <a  href="javascript:;" th:text="${chapterBooks.type}"></a>
        <span class="icon-crumb"></span>
        <a href="javascript:;" th:text="${chapterBooks.title}"></a>
	</div>
</div>
<div class="container margin-top">
    <div class="bookdetails-left">
        <div class="book-title">
            <h1 th:text="${chapterBooks.title}"></h1>
        </div>
        <div class="book-pic">
            <div class="pic"><img th:src="'/index/toHtml?Url='+${chapterBooks.image}" th:alt="${chapterBooks.title}" th:title="${chapterBooks.title}"></div>
        </div>
        <div class="book-details">
            <div class="book-details-left" style="width:100%;float:none !important;">
                <table>
                    <tbody>
                    <tr>
                        <td style="width:80px;">作　者：</td>
                        <td th:text="${chapterBooks.author}"></td>
                    </tr>
                    <tr>
                        <td style="width:80px;">出版社：</td>
                        <td><a href="javascript:;" th:title="${chapterBooks.press}" target="_blank" th:text="${chapterBooks.press}"></a></td>
                    </tr>
                    <tr>
                        <td style="width:80px;">丛编项：</td>
                        <td>无</td>
                    </tr>
                    <tr>
                        <td style="width:80px;">版权说明：</td>
                        <td>经版权方授权连载试读，不得转载</td>
                    </tr>
                    </tbody>
                </table>
            </div>
            <hr class="margin-large-top margin-large-bottom">
            <div class="thumbs">
                <span onclick="changeThumbs(this)" class="thumbs-span"> <img th:src="@{/static/picture/thumbs-down.png}" style="width: 30px; height: 30px;"></span>
                <span onclick="changeOrder(this)"  class="order-span" ><img th:src="@{/static/picture/order4.png}" alt="订阅"  title="订阅" style="width: 30px;height: 30px; margin-top: 1px;"></span>
<!--                <img th:src="@{/static/picture/thumbs-up.png}" style="width: 30px; height: 30px;">-->
            </div>
        </div>
        <div class="book-summary"><h4>内容简介</h4>
            <div class="border margin-top padding-large">
                <div class="text txtsummary" th:text="${chapterBooks.book_introduction}">

                </div>
            </div>
        </div>
        <div class="book-summary"><h4>作者简介</h4>
            <div class="border margin-top padding-large">
                <div class="text txtsummary" th:text="${chapterBooks.author_introduction}">　　</div>
            </div>
        </div>
        <div class="book-summary">
            <div class="text-big">目录</div>

            <div class="border margin-top margin-large-bottom">
                <div class="book-chapter">
                    <span class="icon-caidan margin-right text-main"></span>正文</div>
                <div style=" display: inline-block; width: 49%;margin-right: -5px;float: left;">
                    <table id="ctl00_c1_volumes_ctl00_chapters" class="booklist-table table-striped" cellspacing="0"
                           border="0" style="border-collapse:collapse;">
                        <tr th:each="chapter,iterStat:${chapterBooks.chapters}" th:if="${iterStat.count % 2 == 1} ">
                            <td><a th:href="@{/book/getChapter/}+${chapter.book_id}+'/'+${chapter.id}" th:text="${chapter.chapter_title}"></a></td>
                            <!-- <td><a th:href="@{/book/getChapter/}+${chapter.book_id}+'/'+${chapter.id}" th:text="${chapter.chapter_title}"></a></td>-->
                        </tr>
                    </table>
                </div>
                <div style="display: inline-block;width: 51%">
                    <table id="ctl00_c1_volumes_ctl00_chapters1" class="booklist-table table-striped" cellspacing="0"
                           border="0" style="border-collapse:collapse;">
                        <tr th:each="chapter,iterStat:${chapterBooks.chapters}" th:if="${iterStat.count % 2 == 0} ">
                            <td><a th:href="@{/book/getChapter/}+${chapter.book_id}+'/'+${chapter.id}" th:text="${chapter.chapter_title}"></a></td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
        <div class="margin-top margin-large-bottom text-center">
            <script async="" th:src="@{../../static/js/adsbygoogle.js}"></script>
            <!-- read*底部 -->
            <ins class="adsbygoogle" style="display:inline-block;width:728px;height:90px"
                 data-ad-client="ca-pub-7029444221371985" data-ad-slot="7049136436"></ins>
            <script>
                (adsbygoogle = window.adsbygoogle || []).push({});
            </script>
        </div>
    </div>
    <div class="bookdetails-right">
        <div style="height:250px;">
            <script type="text/javascript" th:src="@{../../static/js/xjhx.js}"></script>
        </div>
        <div class="tit margin-big-top"><h3>读书推荐</h3></div>
        <div id="J_commend" class="books-left border">
			<!--排行榜-->
            <ul>
                <li th:each="book,iterStat:${rankBooks}">
                    <p style="display: none;" class="fold">
                        <a th:href="@{/index/toBookInfo/}+${book.id}" th:title="${book.title}" target="_blank" th:text="${book.title}"><i th:text="${iterStat.count}"></i></a></p>
                    <div class="unfold" style="display: block;">
                        <i th:text="${iterStat.count}"></i>
                        <div>
                            <div class="img80"><a th:href="@{/index/toBookInfo/}+${book.id}" th:title="${book.title}" target="_blank"><img th:alt="${book.title}" th:src="'/index/toHtml?Url='+${book.image}"></a></div>
                            <h3><a th:href="@{/index/toBookInfo/}+${book.id}" th:title="${book.title}" target="_blank" th:text="${book.title}"></a></h3>
                            <p></p>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="margin-big-top" id="sidebar">
            <script async="" th:src="@{../../static/js/adsbygoogle.js}"></script>
            <!-- 300-right -->
            <ins class="adsbygoogle" style="display:inline-block;width:300px;height:250px"
                 data-ad-client="ca-pub-7029444221371985" data-ad-slot="1399555633"></ins>
            <script>
                (adsbygoogle = window.adsbygoogle || []).push({});
            </script>
            <div id="qrcode"></div>
            <div class="margin-big-top text-center text-gray">扫描二维码</div>
        </div>
    </div>
</div>

<div class="layout" id="footer">
    <div class="container padding">
        <div class="text-center">
            <ul class="nav nav-inline">
                <li><a href="1587.html">关于读书</a></li>
                <li><a href="1588.html">免责声明</a></li>
                <li><a href="1589.html">读书目录</a></li>
                <li><a href="1590.html">联系我们</a></li>
            </ul>
        </div>
        <div class="text-center height-big">Copyright © 读书网 www.dushu.com 2005-2020, All Rights Reserved.</div>
        <div class="text-center height-big"><a href="javascript:;">鄂ICP备15019699号</a> <img
                th:src="@{../../static/picture/beian.png}" style="vertical-align:middle;margin-left:10px;"> 鄂公网安备 42010302001612号
        </div>
    </div>
</div>
<script>
    /*设置全局变量，计算用户点击次数*/
    let countNumber = 0;
    let orderNumber = 0;
    /* <img th:src="@{/static/picture/thumbs-up.png}" style="width: 30px; height: 30px;">*/


    function changeThumbs(e) {
        countNumber+=1;
        let pContent = $(e).find("p:eq(0)").text();
        /*获取登陆之后的用户id*/
        let userId = $(".show-session").find("span:eq(0)").text();
        let bookId = $(".show-session").find("span:eq(1)").text();

        if(userId == '无'){
            alert("请先登录！！");
            return;
        }
        if (countNumber<5){
            if(pContent == ''){
                console.log("已点赞");
                //temp状态值为1，同时该书的获赞数+1
                $.post(
                    "/like/changeStatus",
                    {'userId':userId,'bookId':bookId,'status':1},
                    function (data) {
                    }
                );
                $(e).empty();
                $(e).append("<img src=\"/static/picture/thumbs-up.png\" style=\"width: 30px; height: 30px;\"> <p style=\"display: inline-block;color: #61ABAA;\">已点赞</p>");
                return ;
            }else {
                //temp状态值为0，同时该书的获赞数-1
                console.log("未点赞");
                $.post(
                    "/like/changeStatus",
                    {'userId':userId,'bookId':bookId,'status':0},
                    function (data) {
                    }
                );
                $(e).empty();
                $(e).append("<img src=\"/static/picture/thumbs-down.png\" style=\"width: 30px; height: 30px;\">");
                return;
            }
        }else {
            alert("客官慢点哈！！");
        }
    }

    /*判断是否订阅*/
    function changeOrder(e) {
        orderNumber+=1;
        let pContent = $(e).find("p:eq(0)").text();
        /*获取登陆之后的用户id*/
        let userId = $(".show-session").find("span:eq(0)").text();
        let bookId = $(".show-session").find("span:eq(1)").text();

        if(userId == '无'){
            alert("请先登录！！");
            return;
        }
        if (countNumber<5){
            if(pContent == ''){
                console.log("已订阅");
                //temp状态值为1，同时该书的评论数+1
                $.post(
                    "/like/changeOrder",
                    {'userId':userId,'bookId':bookId,'chapter_title':chapters.chapter_title,'chapter_id':chapters.id,'status':1},
                    function (data) {
                    }
                );
                $(e).empty();
                $(e).append("<img src=\"/static/picture/order3.png\" alt=\"订阅\"  title=\"订阅\" style=\"width: 30px;height: 30px; margin-top: 1px;\"><p style=\"display: inline-block;color: #61ABAA;padding-left: 5px;\">已订阅</p>");
                return ;
            }else {
                //temp状态值为0，同时该书的获赞数-1
                console.log("未订阅");
                $.post(
                    "/like/changeOrder",
                    {'userId':userId,'bookId':bookId,'chapter_title':chapters.chapter_title,'chapter_id':chapters.id,'status':0},
                    function (data) {
                    }
                );
                $(e).empty();
                $(e).append("<img src=\"/static/picture/order4.png\" alt=\"订阅\"  title=\"订阅\" style=\"width: 30px;height: 30px; margin-top: 1px;\">");
                return;
            }
        }else {
            alert("客官勿重复操作！！");
        }
    }
</script>

<script lang="javascript" type="text/javascript" th:src="@{../../static/js/common.min-201706.js}"></script>
</body>
</html>
